<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
    String path = request.getContextPath();
			String basePath = request.getScheme() + "://"
					+ request.getServerName() + ":" + request.getServerPort()
					+ path + "/";
%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Amaze UI Admin index Examples</title>
<meta name="description" content="这是一个 index 页面">
<meta name="keywords" content="index">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="icon" type="image/png" href="assets/i/favicon.png">
<link rel="apple-touch-icon-precomposed" href="assets/i/app-icon72x72@2x.png">
<meta name="apple-mobile-web-app-title" content="Amaze UI" />
<link rel="stylesheet" href="assets/css/amazeui.min.css" />
<link rel="stylesheet" href="assets/css/amazeui.datatables.min.css" />
<link rel="stylesheet" href="assets/css/app.css">
<script src="assets/js/jquery.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.tips.js"></script>

</head>

<body data-type="login">
	<script src="assets/js/theme.js"></script>
	<div class="am-g tpl-g">
		<!-- 风格切换 -->
		<div class="tpl-skiner">
			<div class="tpl-skiner-toggle am-icon-cog"></div>
			<div class="tpl-skiner-content">
				<div class="tpl-skiner-content-title">选择主题</div>
				<div class="tpl-skiner-content-bar">
					<span class="skiner-color skiner-white" data-color="theme-white"></span> <span class="skiner-color skiner-black" data-color="theme-black"></span>
				</div>
			</div>
		</div>
		<div class="tpl-login">
			<div class="tpl-login-content">
				<div class="tpl-login-title">注册用户</div>
				<span class="tpl-login-content-info"> 创建一个新的用户 </span>


				<form class="am-form tpl-form-line-form">
					<div class="am-form-group">
						<input type="text" class="tpl-form-input" id="mailbox" placeholder="邮箱">

					</div>

					<div class="am-form-group">
						<input type="text" class="tpl-form-input" id="username" placeholder="用户名">
					</div>

					<div class="am-form-group">
						<input type="password" class="tpl-form-input" id="password" placeholder="请输入密码">
					</div>

					<div class="am-form-group">
						<input type="password" class="tpl-form-input" id="password2" placeholder="再次输入密码">
					</div>

					<div class="am-form-group tpl-login-remember-me">
						<input id="remember-me" type="checkbox"> <label for="remember-me"> 我已阅读并同意 <a href="javascript:;">《用户注册协议》</a>
						</label>

					</div>
					<div class="am-form-group">

						<button id="submmit" type="button" onclick="register();" class="am-btn am-btn-primary  am-btn-block tpl-btn-bg-color-success  tpl-login-btn">提交</button>

					</div>
				</form>
			</div>
		</div>
	</div>
	<script src="assets/js/amazeui.min.js"></script>
	<script src="assets/js/app.js"></script>
	<script type="text/javascript">
		function register() {
			var user =
			{
					"mailbox":$("#mailbox").val().trim(),
					"username":$("#username").val().trim(),
					"password":$("#password").val().trim()
			};
			$.ajax({
				type : "POST",
				url : 'register',
				data : JSON.stringify(user),
				dataType : 'json',
				contentType:"application/json;charset=utf-8",
				cache : false,
				success : function(data) {
					if ("success" == data.result) {
						$("#submmit").tips({
							side : 1,
							msg : '注册成功 , 即将跳转到登录页 ...',
							bg : '#68B500',
							time : 2
						});
						//2秒钟后跳转到登录页
						setTimeout(function () { 
							window.location.href = "/login_toLogin";
					    }, 2000);
					} else if ("fail" == data.result) {
						alert("注册失败!");
					} else {
						alert("未知错误");
					}
				}
			});
		}
	</script>

</body>

</html>